{extend name="user:base" /}
{block name="main"}
<link rel="stylesheet" href="{:config('web.cdn')}/static/wangEditor/wangEditor.min.css">

<script src="https://cdn.bootcss.com/highlight.js/8.0/highlight.min.js"></script>
<link href="https://cdn.bootcss.com/highlight.js/8.0/styles/monokai-sublime.min.css" rel="stylesheet">

<style>
	.w-e-toolbar {
		flex-wrap: wrap;
		-webkit-box-lines: multiple;
	}

	.w-e-toolbar .w-e-menu:hover{
		z-index: 10002!important;
	}

	.w-e-menu a {
		text-decoration: none;
	}

	.fullscreen-editor {
		position: fixed !important;
		width: 100% !important;
		height: 100% !important;
		left: 0px !important;
		top: 0px !important;
		background-color: white;
		z-index: 9999;
	}

	.fullscreen-editor .w-e-text-container {
		width: 100% !important;
		height: 95% !important;
	}
</style>
<!-- begin::main content -->
<main class="main-content">
<div class="layui-fluid ucenter">
	<div class="layui-row">

		  <div class="userCon layui-col-md12  layui-col-space20">

	<div class="fly-panel fly-panel-user">
		<div class="layui-tab layui-tab-brief" lay-filter="user">
			<ul class="layui-tab-title" id="LAY_mine">
				<li class="layui-this" lay-id="info">添加文章</li>
			</ul>
			<div class="layui-tab-content" style="padding: 20px 0;">
				<div class="layui-form layui-form-pane layui-tab-item layui-show">
					<form method="post" class="layui-form" onsubmit="return false">
						<div class="layui-form-item">
							<div class="layui-input-inline artitle">
								<div class="layui-btn-group">
									<button type="button" class="layui-btn layui-btn-primary layui-btn-sm" onclick="history.go(-1)">
										<i class="layui-icon layui-icon-refresh-3"></i>返回上页
									</button>
									&nbsp;&nbsp;
									<a  href="{:url('User/index')}" class="layui-btn layui-btn-primary layui-btn-sm" >
										<i class="layui-icon layui-icon-username"></i>个人中心
									</a>
								</div>
							</div>
						</div>



						{notempty name='$article'}
						<input type="hidden"  name="id" autocomplete="off" value="{$article.id}" class="layui-input">
						{/notempty}
						<div class="layui-form-item">
							<div class="layui-input-inline artitle">
								<input placeholder="文章标题" type="text" id="L_email" name="title" required  autocomplete="off"
									   value="{notempty name='$article'}{$article.title}{/notempty}"
									   class="layui-input">
							</div>
						</div>

						<input type="hidden"  name="is_md" autocomplete="off" value="0" class="layui-input">

						<div class="form-group">
							<div class="col-xs-12">
								<dd class="col-sm-9">
									<dl class="row">
										<dt class="col-sm-2">
											<button type="button"
													class="layui-btn layui-btn-primary layui-btn-sm"
													id="test999"
													style="width: 150px !important; height: 30px !important;">
												<i class="layui-icon">&#xe67c;</i>上传Word
											</button>
										</dt>
										<dd class="col-sm-8">
											可以利用word导入功能将文章内容导入
										</dd>
									</dl>
								</dd>
							</div>
						</div>
						<div class="layui-form-item layui-form-text">

							<div class="layui-input-block">
								<div id="editor">
									<p>{notempty name='$article'}{:htmlspecialchars_decode($article.article.info)}{/notempty}</p>
								</div>
							</div>
						</div>


						<div class="layui-form-item">
							<div class="layui-input-inline artitle">
								{empty name="$article"}
								{:uploader('prefimg')}
								{else /}
								{:uploader('prefimg',$article['prefimg'])}
								{/empty}
							</div>
						</div>


						{empty name='$article'}
						<!--当修改文章时，屏蔽到原分类，避免分类错误-->
						<div class="layui-form-item">
							<label for="L_city" class="layui-form-label">分类</label>
							<div class="layui-input-inline">
								<div id="cate1"></div>
							</div>

							<div class="layui-input-inline">
								<div id="cate2"></div>
							</div>
						</div>
						{/empty}

						{if isset($article)}
						<input type="hidden" name="cate_id" value="{$article.cate_id}">
						{/if}

						{include file="article/users"}

						<div class="layui-form-item layui-form-text">
							<label class="layui-form-label">隐藏信息[可空]</label>
							<div class="layui-input-block">
								{empty name="$article"}
								<textarea name="hidden_info" class="layui-textarea"></textarea>
								{else /}
								<textarea name="hidden_info" class="layui-textarea">{$article.hidden_info}</textarea>
								{/empty}
							</div>
						</div>

						<div class="layui-form-item">
							<div class="layui-input-inline artitle">
								<input placeholder="查看隐藏信息所需积分"
									   type="number"
									   min="0"
									   max="100"
									   name="score"
									   value="{notempty name='$article'}{$article.score}{/notempty}"
									   class="layui-input">
							</div>
						</div>

						{if $index_user.is_admin == 1}
						<!--当发布者为后台管理员时可以操作-->
						<div class="layui-form-item">
							<label for="L_city" class="layui-form-label">点击量</label>
							<div class="layui-input-inline">
								{empty name="$article"}
								<input type="number" id="L_city" name="hits" autocomplete="off" value="{:rand(40,700)}" class="layui-input">
								{else /}
								<input type="number" id="L_city" name="hits" autocomplete="off" value="{$article.hits}" class="layui-input">
								{/empty}
							</div>
						</div>

						<div class="layui-form-item">
							<label for="L_city" class="layui-form-label">喜欢</label>
							<div class="layui-input-inline">
								{empty name="$article"}
								<input type="number"  name="like" autocomplete="off" value="{:rand(2,50)}" class="layui-input">
								{else /}
								<input type="number"  name="like" autocomplete="off" value="{$article.like}" class="layui-input">
								{/empty}
							</div>
						</div>
						<!--是否推荐-->
						<div class="layui-form-item">
							<label for="L_city" class="layui-form-label">推荐</label>
							<div class="layui-input-inline">

								{empty name="$article"}
								<input type="radio" name="recommend" value="1" title="推荐" >
								<input type="radio" name="recommend" value="0" title="不推荐" checked="checked">
								{else /}
								<input type="radio" name="recommend" value="1" title="推荐" {if $article.recommend ==1}checked{/if}>
								<input type="radio" name="recommend" value="0" title="不推荐" {if $article.recommend ==0}checked{/if}>
								{/empty}
							</div>
						</div>

						<!--是否置顶-->
						<div class="layui-form-item">
							<label for="L_city" class="layui-form-label">置顶</label>
							<div class="layui-input-inline">

								{empty name="$article"}
								<input type="radio" name="top" value="1" title="置顶" >
								<input type="radio" name="top" value="0" title="不置顶" checked="checked">
								{else /}
								<input type="radio" name="top" value="1" title="置顶" {if $article.top ==1}checked{/if}>
								<input type="radio" name="top" value="0" title="不置顶" {if $article.top ==0}checked{/if}>
								{/empty}
							</div>
						</div>

						{/if}
						<!--当发布者为后台管理员时可以操作-->
						<div class="layui-form-item">
							<button class="layui-btn" key="set-mine" lay-submit lay-filter="info">立即发布</button>
							<button class="layui-btn" key="set-mine" lay-submit lay-filter="draft">保存草稿</button>
						</div>
					</form>
				</div>
			</div>

		</div>
	</div>
</div>

	</div>
</div>
</main>

<!--如果想使用其他的editor 推荐Simditor-->
<script src="{:config('web.cdn')}/static/wangEditor/wangEditor.min.js"></script>
<script type="text/javascript">

    $(function (){

        const E = window.wangEditor
        const  editor = new E('#editor')
        // 或者 var editor = new E( document.getElementById('editor') )
        // 设置编辑区域高度为 500px
        console.log(editor.config);
        editor.config.height = 800
        editor.config.zIndex = 500

        // 配置服务器端地址
        editor.config.uploadFileName = 'file';
        editor.config.uploadImgServer = "{:url('Upload/wang_editor_upload')}";

        // 挂载highlight插件
        editor.highlight = hljs
		
        editor.create()
        layui.use('upload', function(){
            var upload = layui.upload;

            //执行实例
            var uploadInst = upload.render({
                elem: '#test999' //绑定元素
                ,url: "{:url('Upload/uploadword')}" //上传接口
                ,accept: "file"
                ,done: function(res){
                    //上传完毕回调
                    console.log(res.array)
                    editor.txt.html(res.array[0]) // 重新设置编辑器内容
                }
                ,error: function(){
                    //请求异常回调
                }
            });
        });

        layui.use(['form'], function(){
            var form = layui.form;
            //文章提交保存
            form.on('submit(info)', function(data){
                var val = editor.txt.html()
                data.field.info = val;
                console.log(data.field);
                var url = "{:url('article/save')}";
                $.post(url,data.field,function (e) {
                    if(e.code ==200){
                        success(e.msg);
                        setTimeout("location.reload()",2000);
                    }else {
                        error(e.msg);
                    }
                })
                return false;
            });
            form.on('submit(draft)', function(data){
                var temp = data.field;
                temp.status = 2; //草稿
                var val = editor.txt.html()
                temp.info = val;
                console.log(temp);
                var url = "{:url('article/save')}";
                $.post(url,temp,function (e) {
                    if(e.code ==200){
                        success(e.msg);
                        setTimeout("location.reload()",2000);
                    }else {
                        error(e.msg);
                    }
                })

            });

            //ajax获取分类数据
            function getCate(pid,name,id){
                var url = "{:url('article/get_cate')}";
                $.post(url,{pid:pid},function (e) {
                    //console.log(e)
                    var html="";
                    var data = e.data;
                    html += '<select name="cate_id" id="'+name+'_id" lay-filter="'+id+'" lay-verify="required">';
                    html += '<option value="">请选择</option>';
                    for (var i = 0;i<data.length;i++){
                        html += "<option  value='"+data[i].id+"'>"+data[i].name+"</option>";
                    }
                    if(data.length > 0){
                        $("#"+id).html(html);
                    }else {
                        $("#"+id).children().remove();
                    }
                    html += '</select>';
                    form.render();
                })

            };
            getCate(0,'cate_id','cate1');

            //目前系统无三级分类，故二级即可实现需求
            form.on('select(cate1)', function(data){
                //console.log(data.elem); //得到select原始DOM对象
                //console.log(data.value); //得到被选中的值
                //console.log(data.othis); //得到美化后的DOM对象
                getCate(data.value,"cate_id",'cate2')
            });
        });
    });







</script>
{/block}